<!--
 * @Author: zsc
 * @Date: 2022-06-21 23:13:42
 * @LastEditors: zsc
 * @LastEditTime: 2022-07-17 20:16:21
 * @Description:辖区选择
-->
<template>
  <el-select
    :value="value"
    placeholder="请选择辖区"
    filterable
    clearable
    @input="$emit('input', $event)"
  >
    <el-option
      v-for="item in stateOptions"
      :key="item.id"
      :label="item.name"
      :value="item.id"
    />
  </el-select>
</template>

<script>
import { jurisdictionColumn } from '@/api/jurisdiction'
export default {
  props: {
    value: {
      type: [String, Number],
      default: ''
    }
  },
  data() {
    return {
      listQuery: {

      },
      stateOptions: []
    }
  },
  computed: {},
  created() {
    this.getList()
  },
  methods: {
    async getList() {
      const res = await jurisdictionColumn(this.listQuery)
      const { data } = res
      data.forEach(element => {
        element.name = element.province_name + '/' + element.city_name + '/' + element.area_name + '/' + element.street_name
      })
      this.stateOptions = data
    }
    // otherData(event) {
    //   console.log(event)
    //   const data = this.stateOptions.find(p => p.id === event)
    //   this.$emit('otherData', data)
    // }
  }
}
</script>
